<!--
 * @Author: wuwk
 * @Date: 2021-12-20 16:58:26
 * @LastEditors: wuwk
 * @LastEditTime: 2021-12-20 17:15:37
 * @Description: 
-->
<template>
  <div class="top">
    <div class="title" :title="title">{{ title }}</div>
      <div class="unit" v-if="unit">单位：{{ unit }}</div>
  </div>
</template>

<script>
export default {
  name: 'ProjectCharttitle',
  props: {
    title: {
      type: String,
      required: true,
    },
    unit: {
      type: String,
    }
  },
};
</script>

<style lang="scss" scoped>
.top {
  display: flex;
  font-size: 14px;
  .title {
    flex: 1;
    color: rgb(0, 216, 255);
    border-left: 4px solid rgb(0, 216, 255);
    padding-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .unit {
    text-align: right;
    width: 100px;
    color: rgba(255, 255, 255, 0.6);
  }
}
</style>